<header id="tt-header">
    <div class="container">
        <div class="row tt-row no-gutters">
            <div class="col-auto">
                <!-- toggle mobile menu -->
                <a class="toggle-mobile-menu" href="#">
                    <svg class="tt-icon">
                        <use xlink:href="#icon-menu_icon"></use>
                    </svg>
                </a>
                <!-- /toggle mobile menu -->
                <!-- logo -->
                <div class="tt-logo">
                    <a href="{{ route('root') }}"><img src="{{ asset('images/logo.png') }}" alt=""></a>
                </div>
                <!-- /logo -->
                <!-- desctop menu -->
            @include('layouts._desktop-menu')
            <!-- /desctop menu -->
                <!-- tt-search -->
                <div class="tt-search">
                    <!-- toggle -->
                    <button class="tt-search-toggle" data-toggle="modal" data-target="#modalAdvancedSearch">
                        <svg class="tt-icon">
                            <use xlink:href="#icon-search"></use>
                        </svg>
                    </button>
                    <!-- /toggle -->
                    <form class="search-wrapper">
                        <div class="search-form">
                            <input type="text" class="tt-search__input" placeholder="搜索">
                            <button class="tt-search__btn" type="submit">
                                <svg class="tt-icon">
                                    <use xlink:href="#icon-search"></use>
                                </svg>
                            </button>
                            <button class="tt-search__close">
                                <svg class="tt-icon">
                                    <use xlink:href="#cancel"></use>
                                </svg>
                            </button>
                        </div>
                        <div class="search-results">
                            <div class="tt-search-scroll">
                                <ul>
                                    <li>
                                        <a href="page-single-topic.html">
                                            <h6 class="tt-title">Rdr2 secret easter eggs</h6>
                                            <div class="tt-description">
                                                Here’s what I’ve found in Red Dead Redem..
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="page-single-topic.html">
                                            <h6 class="tt-title">Top 10 easter eggs in Red Dead Rede..</h6>
                                            <div class="tt-description">
                                                You can find these easter eggs in Red Dea..
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="page-single-topic.html">
                                            <h6 class="tt-title">Red Dead Redemtion: Arthur Morgan..</h6>
                                            <div class="tt-description">
                                                Here’s what I’ve found in Red Dead Redem..
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="page-single-topic.html">
                                            <h6 class="tt-title">Rdr2 secret easter eggs</h6>
                                            <div class="tt-description">
                                                Here’s what I’ve found in Red Dead Redem..
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="page-single-topic.html">
                                            <h6 class="tt-title">Top 10 easter eggs in Red Dead Rede..</h6>
                                            <div class="tt-description">
                                                You can find these easter eggs in Red Dea..
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="page-single-topic.html">
                                            <h6 class="tt-title">Red Dead Redemtion: Arthur Morgan..</h6>
                                            <div class="tt-description">
                                                Here’s what I’ve found in Red Dead Redem..
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <button type="button" class="tt-view-all" data-toggle="modal"
                                    data-target="#modalAdvancedSearch">Advanced Search
                            </button>
                        </div>
                    </form>
                </div>
                <!-- /tt-search -->
            </div>
            <div class="col-auto ml-auto">
                @guest
                    <div class="tt-account-btn">
                        <a href="{{ route('login') }}" class="btn btn-primary">登录</a>
                        <a href="{{ route('register') }}" class="btn btn-secondary">注册</a>
                    </div>

                @else

                    <div class="tt-user-info d-flex justify-content-center">

                        <div class="notification-badge">
                            <a href="{{ route('users.show', [Auth::user()->id, 'tab' => 'notifications']) }}"
                               class="mr-3 badge badge-pill badge badge-pill badge-{{ Auth::user()->notification_count > 0 ? 'hint' : 'secondary' }} text-white">
                                {{ Auth::user()->notification_count }}
                            </a>
                        </div>

                        <div class="tt-avatar-icon tt-size-sm">
                            <img src="{{ Auth::user()->avatar }}"
                                 class="img-responsive img-circle" width="30px" height="30px">
                        </div>

                        <div class="tt-desktop-menu">

                            <nav>
                                <ul>
                                    <li><span>{{ Auth::user()->name }}</span>
                                        <ul>
                                            @can('manage_contents')
                                                <li><a href="{{ url(config('administrator.uri')) }}"><i
                                                                class="fa fa-tachometer-alt"></i> 管理后台</a></li>
                                            @endcan
                                            <li><a href="{{ route('users.show',Auth::id()) }}"><i
                                                            class="fa fa-user"></i> 个人中心</a></li>
                                            <li><a href="{{ route('users.edit',Auth::id()) }}"><i
                                                            class="fa fa-edit"></i> 编辑资料</a></li>
                                            <li>
                                                <a class="" id="logout" href="#">
                                                    <form action="{{ route('logout') }}" method="POST">
                                                        {{ csrf_field() }}
                                                        <button class="btn btn-sm btn-danger" type="submit"
                                                                name="button">退出
                                                        </button>
                                                    </form>
                                                </a>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>
                            </nav>
                        </div>

                    </div>

                @endguest
            </div>
        </div>
    </div>
</header>